﻿<div ng-controller="admissionCtrl" style="background-color:aqua;">
   

    <!--AdmissionModal-->
    <div id="AdmissionModal">



        <button class="btn btn-warning" ng-click="cancelF()" style="text-align:left;"><span class="fa fa-arrow-left">&nbsp;</span>Back</button>
        <h1 style="text-align:center">Delport High School</h1>
        <h2 style="text-align:center"> Admission Form</h2>

        <hr />

        <form name="AdmissionForm" class="form-horizontal">

            <div class="col-md-6">
                <div class="form-group" ng-class="{'has-error':AdmissionForm.name.$invalid && !AdmissionForm.name.$pristine}">
                    <label class="col-sm-4 control-label"for="name">Student's Full Name  *</label>
                    <div class="col-sm-8">
                        <input type="text" class="form-control" id="name" name="name" ng-model="current.Name" required />
                        <div ng-show="AdmissionForm.name.$error.required && !AdmissionForm.name.$pristine" class="help-block">Student Name is required!</div>
                    </div>
                </div>
                <div class="form-group" ng-class="{'has-error':AdmissionForm.fname.$invalid && !AdmissionForm.fname.$pristine}">
                    <label class="col-sm-4 control-label" for="fmane">Father's Name  *</label>
                    <div class="col-sm-8">
                        <input type="text" class="form-control" id="fname" name="fname" ng-model="current.FathersName" required />
                        <div ng-show="AdmissionForm.fname.$error.required && !AdmissionForm.fname.$pristine" class="help-block">Father's Name is required!</div>
                    </div>
                </div>
                <div class="form-group" ng-class="{'has-error':AdmissionForm.mname.$invalid && !AdmissionForm.mname.$pristine}">
                    <label class="col-sm-4 control-label" for="mname">Mother's Name  *</label>
                    <div class="col-sm-8">
                        <input type="text" class="form-control" id="mname" name="mname" ng-model="current.MothersName" required />
                        <div ng-show="AdmissionForm.mname.$error.required && !AdmissionForm.mname.$pristine" class="help-block">Mother's Name is required!</div>
                    </div>
                </div>
                <div class="form-group" ng-class="{'has-error':AdmissionForm.cname.$invalid && !AdmissionForm.cname.$pristine}">
                    <label class=" col-sm-4 control-label" for="cadd">Current Address  *</label>
                    <div class="col-sm-8">
                        <textarea class="form-control" rows="3" id="cadd" name="cname" ng-model="current.CurrentAddress" required></textarea>
                        <div ng-show="AdmissionForm.cname.$error.required && !AdmissionForm.cname.$pristine" class="help-block">Current Address is required!</div>
                    </div>

                </div>
                <div class="form-group" ng-class="{'has-error':AdmissionForm.pname.$invalid && !AdmissionForm.pname.$pristine}">
                    <label class=" col-sm-4 control-label" for="padd">Permanent Address  *</label>
                    <div class="col-sm-8">
                        <textarea class="form-control" rows="3" id="padd" name="pname" ng-model="current.PermanentAddress" required></textarea>
                        <div ng-show="AdmissionForm.pname.$error.required && !AdmissionForm.pname.$pristine" class="help-block">Permanent Address is required!</div>
                    </div>

                </div>
            </div>
            <div class="col-md-6">
                <div class="form-group" ng-class="{'has-error':AdmissionForm.phname.$invalid && !AdmissionForm.phname.$pristine}">
                    <label class=" col-sm-4 control-label" for="pnum">Phone Number  *</label>
                    <div class="col-sm-8">
                        <input type="text" class="form-control" id="pnum" name="phname" ng-model="current.PhoneNumber" />
                        <div ng-show="AdmissionForm.phname.$error.required && !AdmissionForm.phname.$pristine" class="help-block">Phone number is required!</div>
                    </div>

                </div>
                <div class="form-group" ng-class="{'has-error':AdmissionForm.ename.$invalid && !AdmissionForm.ename.$pristine}">
                    <label class=" col-sm-4 control-label" for="email">Email  *</label>
                    <div class="col-sm-8">
                        <input type="email" class="form-control" id="email" name="ename" ng-model="current.Email" />
                        <div ng-show="AdmissionForm.ename.$error.required && !AdmissionForm.ename.$pristine" class="help-block">email is required!</div>
                    </div>

                </div>
                <div class="form-group">
                    <label class=" col-sm-4 control-label" for="dob">Date Of Birth  *</label>
                    <div class="col-sm-8">
                        <input class="form-control" type="text" id="dob" ng-model="current.DOB" required placeholder="YYYY-MM-DD" />
                    </div>

                </div>
                <div class="form-group">
                    <label class=" col-sm-4 control-label">Gender  * &nbsp;</label>
                    <div class="col-sm-8">
                        <input type="radio" ng-model="current.Gender" id="male" value="Male" name="gender" /><label for="male"> &nbsp;Male</label> &nbsp;
                        <input type="radio" ng-model="current.Gender" id="female" value="Female" name="gender" /><label for="female"> &nbsp;Female</label>
                    </div>

                </div>
                <hr />
                <div class="form-group">
                    <label class=" col-sm-4 control-label"for="apply">Class you want to apply for  *</label>
                    <div class="col-sm-8">
                        <select class="form-control" ng-model="current.ApplyClass" id="apply">
                            <option value="" selected disabled>Select...</option>
                            <option value="Six">Class VI</option>
                            <option value="Seven">Class VII</option>
                            <option value="Eight">Class VIII</option>
                            <option value="Nine">Class IX</option>


                        </select>
                    </div>

                </div>
                <hr />
            </div>

        </form>


        <div style="text-align:center">
            <button form="AdmissionForm" class="btn btn-success" ng-click="save()" ng-disabled="AdmissionForm.$invalid"><span class="fa fa-check">&nbsp;</span>Apply</button>
            
        </div>



    </div>
    
</div>